<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8" />
		<title></title>
		<script type="text/javascript">
		function get()
		{
				var input = document.getElementById("in").value;
				alert(input);
				var input1 = document.getElementById("in1").value;
				alert(input1);
		}
</script>
		<style type="text/css">
			body{
				margin: 0px;
			}
			.zhezhao{
				position: fixed;
				left: 0px;
				top: 0px;
				background: #000;
				width: 100%;
				height: 100%;
				opacity: 0.5;
			}
			.tankuang{
				position: relative;
				background: #fff;
				width: 50%;
				height: 80%;
				border-radius: 5px;
				margin: 5% auto;
			}
			#header{
				height: 40px;
			}
			#header-right{
				position: absolute;
				width: 25px;
				height: 25px;
				border-radius: 5px;
				background: red;
				color: #fff;
				right: 5px;
				top: 5px;
				text-align: center;
			}
		</style>
	</head>
	<body>
		<button type="button" onclick="dianwo()">点我</button>
		<div class="zhezhao" id='zhezhao'>
			<div class="tankuang">
				<div id="header">
					<form>
					<span>添加助教模块</span>
					<br/>
<span>助教姓名：</span>
<input type ="text" name = "in" id = "in"/>
<br/>
<span>助教学号：</span>
<input type ="text" name = "in1" id = "in1"/>
<br/>
<button onclick="get()">添加</button>
</form>
					<div id="header-right" onclick="hidder()">x</div>
				</div>
			</div>
		</div>
		<script type="text/javascript">
			document.getElementById('zhezhao').style.display="none";
			function dianwo(){
				document.getElementById('zhezhao').style.display="";
			}
			function hidder(){
				document.getElementById('zhezhao').style.display="none";
			}
		</script>
	</body>
</html>
